<template>
  <div>
    <form>
      <label>姓名：</label>
      <input type="text" v-model="uname"/>
      <br />
      <br />

      <label>年龄：</label>
      <input type="number" />
      <br />
      <br />

      <label>身高：</label>
      <input type="number" v-model="tall" />(米)
      <br />
      <br />

      <label>体重：</label>
      <input type="number" v-model="weight" />(公斤)
      <br />
      <br />

      <label>病史：</label>
      <input type="text" />
      <br />
      <br />

      <button @click.prevent="bmi">诊断</button>
    </form>

    <p v-show="isShow">患者 {{uname}} 的诊断结果：{{res}}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      isShow: false,
      uname:'',
      tall: '',
      weight: '',
      res: '',
    }
  },
  methods: {
    bmi() {
      const bmi1 = this.weight / (this.tall * this.tall)
      if (this.tall === '' || this.weight === '') {
        return alert('不能为空')
      }
      if (bmi1 < 18.5) {
        this.res = '体重过轻'
      } else if (bmi1 >= 18.5 && bmi1 < 24.9) {
        this.res = '体重正常'
      } else if (bmi1 >= 24.9 && bmi1 < 29.9) {
        this.res = '体重过重'
      } else {
        this.res = '体重肥胖'
      }

      this.isShow = true
    },
  },
}
</script>